import '../../../style/outSignLayout.less';
import React, {Component} from 'react';
import {inject, observer} from 'mobx-react';
import { withRouter } from 'react-router-dom';
import { RouteLayout } from 'weaver-mobile-page';
import { Tools } from 'weaver-mobile';
import TitlePage from '../../coms/TitlePage';
import LocationInfo from './LocationInfo';
import Remark from './Remark';
import SignBtn from './SignBtn';

const getLabel = Tools.getLabel;

@inject('outSignStoreV2')
@inject('outSignRouteStore')
@withRouter
@observer
export default class SignRouteLayout extends Component {
  componentDidMount(){
    this.init();
  }

  init = () => {
    const {outSignRouteStore, outSignStoreV2} = this.props;
    outSignRouteStore.outSignStoreV2 = outSignStoreV2;
    outSignRouteStore.init();
  }

  render() {
    const {outSignRouteStore} = this.props;
    
    return (
        <RouteLayout>
            <div className='wm-route-layout'>
                <TitlePage title={getLabel('82634','外勤签到')}>
                  <div className='outSignRouteLayoutV2'>
                    <LocationInfo store={outSignRouteStore} />
                    <Remark store={outSignRouteStore} />
                    <SignBtn store={outSignRouteStore} />
                  </div>
                </TitlePage>
            </div>
        </RouteLayout>
    )
  }
}